<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script>
		function myLoad(){
			//页面加载完毕之后再去获取页面上的元素，否则获取不到
			//根据ID 获取元素，只能获取到唯一元素（如果有重名的ID元素，获取到的是第一个元素）
			var div=document.getElementById("myDiv");
			console.log(div);
			//根据指定的类样式的名称获取元素，返回集合
			var list=document.getElementsByClassName("demo");
			console.log("根据类样式的名称获取到的元素的集合长度是："+list.length);
			for(var i=0;i<list.length;i++){
				console.log(list[i]);
			}
			//根据指定HTML标签名称获取元素，返回集合
			var list2=document.getElementsByTagName("li");
		    console.log("根据标签的名称获取到的元素的集合长度是："+list2.length);
			for(var i=0;i<list2.length;i++){
				console.log(list2[i]);
			}
			//根据指定HTML元素的name属性获取元素，返回集合
			var list3=document.getElementsByName("myli");
			console.log("根据标签的名称属性获取到的元素的集合长度是："+list3.length);
			for(var i=0;i<list3.length;i++){
				console.log(list3[i]);
			}
		}
		</script>
	</head>
	<body onload="myLoad()">
		<p class="demo"></p>
		<div id="myDiv" class="demo">
			div
		</div>
		<ul class="demo">
			<li>li11111111111</li>
			<li name="myli">li11111111111</li>
			<li>li11111111111</li>
			<li name="myli">li11111111111</li>
		</ul>
	</body>
</html>
